<template>
	<div>
		<top-nav bgColor="white" title="新增授权单"  btnName="保存"  :rightShow="true" returnPath="上一级" rightPath="addBills" @fatherDo="saveAdd"></top-nav>
		<section style="height:3rem"></section>
		<section style="display: flex;justify-content: center;align-items: center;flex-direction: column;padding: 0.4rem 0.6rem;">
			<section class="title">

				<label class="left-lab" >产品名称：</label>
				<span class="add-title" >{{addBills.Item.Name}}</span>
			</section>
			<section class="input-add">
				<label class="left-lab">车牌号：</label>
				<mu-text-field class="mu-field-class"  underlineFocusClass="borderClassFocus"    hintText="请输入车牌号" v-model="FCarNo" fullWidth v-on:input ="isVehicleNumber()" />
			<span>{{isCarNomsg}}</span>
			</section>
			<section class="input-add">
				<label class="left-lab">集装箱号：</label>
				<mu-text-field class="mu-field-class" underlineFocusClass="borderClassFocus"    hintText="请输入集装箱号" v-model="containerNnumber" fullWidth />
			</section>
			<section class="input-add">
				<label class="left-lab" >电话号码：</label>
				<mu-text-field class="mu-field-class" underlineFocusClass="borderClassFocus"    hintText="请输入11位电话号码" v-model="phoneNnumber" fullWidth v-on:input ="isPhoneNumber()"  />
				<span>{{isPhonemsg}}</span>
			</section>
			<section class="input-add">
				<label class="left-lab" >预装量：</label>
				<mu-text-field class="mu-field-class" underlineFocusClass="borderClassFocus"    hintText="请输入预装量" v-model="preload" value="number" fullWidth v-on:input ="ispreload()"  />
				<span>{{preloadMsg}}</span>
			</section>
			<section class="title">
				<label class="left-lab" style="flex: 2;">提货方式：</label>
				<span class="add-title" >{{deliveryMode}}</span>
			</section>
		</section>
		<section>
			<p style="color:#0090FF;font-size: 1rem;">账户列表</p>
		</section>
		 <mu-table multiSelectable enableSelectAll ref="table" :showCheckbox="false"  style="padding: 0 0.6rem;">
		    <mu-thead>
		      <mu-tr >
		        <mu-th class="mu-ta-th" >订单编号</mu-th>
		        <mu-th class="mu-ta-th" >暂扣量</mu-th>
		        <mu-th class="mu-ta-th" >余量</mu-th>
		      </mu-tr>
		    </mu-thead>
		    <mu-tbody >
		      <mu-tr >
		        <mu-td style="height: 1.2rem;">{{addBills.Number}}</mu-td>
		        <mu-td>{{preload}}</mu-td>
		        <mu-td>{{addBills.Balance}}</mu-td>
		      </mu-tr>
		    </mu-tbody>
		  </mu-table>


	</div>
</template>

<script>
	import TopNav from '@/components/nav/topNav.vue'
	export default{
		components: {
		      TopNav,
		},
		data(){
			return{
				item:{
					itemName:'不是石灰石',//物料名称
					itemId:'',//物料内码
					itemNo:''//物料編號
				},
				FCarNo:'',//车牌号
				isFcarNo:false,//车牌号验证
				express:/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/,
				isCarNomsg:'',
				containerNnumber:'',
				phoneNnumber:'',
				isphoneNnumber:false,//车牌号验证
				phoneExpress:/^1[3,4,5,7,8]\d{9}$/,
				isPhonemsg:'',
				preload:null,
				isPreload:false,
				preloadMsg:'',
				deliveryMode:'自提',
				orderNumber:'',
				balance:'',
				FCustomName:'',
				organizeid:'',
				AssID:'',
				organizeid:'',
				CustomNo:'',
				Price:'',
				OrderId:'',
				addBills:{}
			}
		},
		mounted(){
			this.addBills=this.$route.params.addBills
			console.info(this.addBills)
//			this.itemName=this.$route.params.itemName
//			this.orderNumber=this.$route.params.orderNumber
//			this.balance=this.$route.params.balance
//			this.itemId=this.$route.params.itemId
//			this.itemNo=this.$route.params.itemNo
//			this.FCustomName=this.$route.params.FCustomName
//			this.organizeid=this.$route.params.organizeid
//			this.AssID=this.$route.params.AssID
//			this.customerid=this.$route.params.customerid
//			this.CustomNo=this.$route.params.CustomNo			
//			this.Price=this.$route.params.Price
//			this.OrderId=this.$route.params.OrderId
			
		},
		methods:{
			saveAdd(data){
				let that=this
				this.$confirm('请确认信息是否准确, 是否保存?', '提示', {
          			confirmButtonText: '确定',
          			cancelButtonText: '取消',
          			center:true,
          			type: 'warning'
        			}).then(() => {
        			that.addTask()

        			}).catch(() => {
					});
			}
		,addTask(){
			let that=this
				that.axios.post('/demo/addTask',{
				'factoryId':localStorage.factoryId,
				'uid':localStorage.uid,
				FCarNo:that.FCarNo,
				containerNnumber:that.containerNnumber,
				phoneNnumber:that.phoneNnumber,
				preload:that.preload,
				deliveryMode:'自提',
				orderNumber:that.addBills.Number,
				balance:that.addBills.Balance,
				itemId:that.addBills.Item.ID,
				itemName:that.addBills.Item.Name,
				itemNo:that.addBills.Item.Number,
				FCustomName:that.addBills.Custom.Name,
				organizeId:that.addBills.OrganizeID,
				AssID:that.addBills.AssID,
				customerid:that.addBills.Custom.ID,
				CustomNo:that.addBills.Custom.Number,		
				Price:that.addBills.Price,
				OrderId:that.addBills.ID
				}).then(function(response){
					console.info(response.data)
					that.sendParams()
					//this.$router.push({path:'demoLaddingBills'})
					//that.$message({type: 'success',message: '保存成功!',duration:1500})
				}).catch(function(error){
					//that.$message({type: 'info',message: '保存失败',duration:1500});
					console.info(error)
				})

		}
		,isVehicleNumber(){
			this.isFcarNo=false
			if (this.FCarNo.length == 7){
        	this.isFcarNo = this.express.test(this.FCarNo);
        	this.isCarNomsg='车牌号格式正确'
     		}else{
     			this.isCarNomsg='请输入正确的车牌号'
     		}
     		
		}
		,isPhoneNumber(){
			this.isphoneNnumber=false
			if (this.phoneNnumber.length == 11){
        	this.isphoneNnumber = this.phoneExpress.test(this.phoneNnumber);
        	this.isPhonemsg='手机格式正确'
     		}else{
     			this.isPhonemsg='请输入正确的手机号'
     		}
     		
		},
		ispreload(){//todo，最好去服务器拿一下看看这期间有人授权么
			this.isPreload=false
			if (this.preload <= this.addBills.Balance){
        	this.isPreload = true
        	this.preloadMsg=''
     		}else{
     			this.preloadMsg='预装量不得大于余量'
     		}	
		},
		sendParams(){
			let that=this
			that.$router.replace(
	 		{path:'demoLaddingBills'})
			}
		}
		
	}
</script>

<style>
	.title{
		border-bottom: 1px solid #e5e5e5;
		width: 100%;
		display: flex;
		justify-content: left;
		align-items: center;
		height: 2.8rem;
	}
	.input-add{
		width: 100%;
		display: flex;
		justify-content: left;
		align-items: center;
		height: 2.8rem;
		flex-direction: row;
	}
	.mu-field-class{
		flex: 6.5;
		margin-bottom: -4px;
		text-align: left;
		font-size: 0.9rem;
	}
	.mu-ta-th{
		font-size: 0.9rem;
		color:#4798f3;
		height: 2rem;
		padding-top: 0;
		padding-bottom: 0;
	}
	.borderClassFocus{
		background:#4798f3;
	}
	.add-title{
		flex: 6.5;
		text-align: left;
	}
	.left-lab{
		 flex: 2;
	}
</style>
